<template>
   <a href="meMore.html"><span class="logonImg"><img src="img/left.jpg"></span></a>
   <!-- 头部 -->
   <div class="home">
     <img src="img/help.png">
     <p>周一至周六8：30 - 17:30</p>
     <h4>400-833-4007</h4>
     <a href="tel:400-883-4007" >一键拨打</a>
   </div>
   <!-- 中部 -->
    <div class="Mid">
      <ul>
        <li><a href="/meAbout.html"><span>1.购买问题</span><img src="img/jiantou.png"></a></li>
        <li><a href="/dataPhome.html"><span>2.收货问题</span><img src="img/jiantou.png"></a></li>
        <li><a href="/dataPass.html"><span>3.支付使用</span><img src="img/jiantou.png"></a></li>
      </ul>
    </div>
</template>

<script>
export default {
  methods:{

  }
}
</script>
<style scoped>
     .logonImg{
      display: inline-block;
    position: fixed;
    top: 1.5%;
    width: 5%;
    left: 2%;
    z-index:1888;
  }
   .logonImg img{
    width:100%;
  }
  a{
    color: #838383;
  }
  .home{
    text-align: center;
  }
   .home p{
    font-size: .12rem;
    color: #666;
   }
   .home h4{
    font-size: .16rem;
   font-weight: bold;
   } 
   .home img{
    width: 35%;
   }
  .home a{
    display: inline-block;
    margin-top: 8px;
    border-radius: 4px;
    color: #fff;
    text-align: left;
    text-indent: 20px;
    width: 78px;
    height: 28px;
    line-height: 28px;
    background: #5fb9ff url(img/tel.png) no-repeat 10px 9px;
    background-size: 12px 12px;
   }
       
  /*中部*/
  .Mid{
    margin-top: 5%;
    width: 100%;
    border: 1px solid #dbdbdb;
    background-color: white;
    color: #838383;
    font-size: .16rem
  }
  .Mid ul{
     width: 90%;
    margin: auto;
  }
  .Mid ul li{
    padding: 4% 0;
    border-top: 1px solid #dbdbdb;
  }
  .Mid ul li:nth-child(1){
   border: none;
  }
   .Mid ul li span:nth-child(2){
     position: absolute; 
      right: 10%
  }
  .Mid ul li img{
    width: 3%;
    margin:0 5%;
    position: absolute; 
    right: 1%
  }
  .Mid .img{
    width:8%;
  }
</style>
